<template>
  <BasicTable @register="registerTable">

  </BasicTable>
</template>

<script lang="ts" setup>
import { watch, ref } from "vue"
import { BasicTable, useTable, BasicColumn } from '/@/components/Table';
import { listPayNode } from './order.api';
const props = defineProps({
  payOrderNo: { type: String, default: '' }
});

const columns: BasicColumn[] = [
  {
    dataIndex: 'createdAt',
    width: 150,
    fixed: 'left'
  },
  {
    width: 270,
    dataIndex: 'title',
  }
];

const [registerTable, { reload }] = useTable({
  api: listPayNode,
  pagination: false,
  beforeFetch: (params) => {
    params.payOrderNo = props.payOrderNo
  },
  showHeader: false,
  showIndexColumn: false,
  columns: columns,
  canResize: false,
});

//适用于 动态改变下拉选项的操作
watch(() => props.payOrderNo, () => {
  if (props.payOrderNo) {
    reload()
  }
});

</script>

<style scoped></style>